/**
 * Created by yujianfu on 2019/9/11.
 */
import React from 'react'

import { Table, Form, DatePicker, Button, Select, Radio } from 'antd'

const { RangePicker } = DatePicker
const FormItem = Form.Item
const { Option } = Select
import { fetchPost } from '../../utils/request'
import moment from 'moment'
import ReportCommon from './ReportCommon'

class Repayment extends React.Component {

  constructor (props) {
    super(props)
    this.state = {
      params: {
        queryDate: moment(moment().subtract(1, 'days'), 'YYYY-MM-DD').format('YYYY-MM-DD'),
      },
      queryDate: null,
    }
  }

  componentDidMount () {
  }

  handleSubmit = (e) => {
    e.preventDefault()
    this.props.form.validateFields((err, fieldsValue) => {
      const rangeValue = fieldsValue['range-picker']
      let queryDate = moment(rangeValue, 'YYYY-MM-DD').format('YYYY-MM-DD')

      this.setState({
        params: { queryDate }
      })
    })
  }

  render () {

    const dateFormat = 'YYYY-MM-DD'
    const rangeConfig = {
      rules: [{ required: true, message: 'Please select Time!' }],
      initialValue: this.state.queryDate != null ? moment(this.state.queryDate, dateFormat) : moment().subtract(1, 'days')
    }

    const formItemLayout = {
      labelCol: {
        xs: { span: 12 },
        sm: { span: 12 },
      },
      wrapperCol: {
        xs: { span: 12 },
        sm: { span: 12 },
      },
    }
    const { getFieldDecorator } = this.props.form

    return (
      <div>
        <Form layout="inline" onSubmit={this.handleSubmit}>
          <FormItem
            {...formItemLayout}
            label="RepaymentDate"
          >
            {getFieldDecorator('range-picker', rangeConfig)(
              <DatePicker/>
            )}
          </FormItem>

          <FormItem>
            <Button type="primary" htmlType="submit">Search</Button>
          </FormItem>

        </Form>

        <br/>
        <ReportCommon params={this.state.params} queryKey="noRepayStat1"
                      name={'No Repay Stat'}/>

        <ReportCommon params={this.state.params} queryKey="noRepayStat2"
                      name={'第二个统计'}/>

      </div>
    )
  }
}

const a = Form.create()(Repayment)
export default a

